<template>

  <div v-if="user!=null">
    <h3>欢迎{{user.nickname}}回来!</h3>
    <router-link to="/post">发微博</router-link>
    <!-- href="javascript:void(0)" 点击超链接时不做跳转 -->
    <a href="javascript:void(0)" @click="logout()">退出登录</a>

  </div>
  <div v-else>
    <router-link to="/reg">注册</router-link> |
    <router-link to="/login">登录</router-link>
  </div>
  <hr>
  <div v-for="weibo in arr">
    <router-link :to="'/detail?id='+weibo.id">
      <h3>{{weibo.nickname}}说:{{weibo.content}}</h3>
    </router-link>

  </div>

</template>

<script setup>
import {onMounted, ref} from "vue";
import axios from "axios";
//localstorage里面装的是字符串
//JSON.parse(localStorage.user)将JSON格式的字符串转成对象
const user = ref(localStorage.user?JSON.parse(localStorage.user):null);
const logout=()=>{
  if (confirm("您确认退出登录吗?")){
    localStorage.clear();//清空记录的用户信息
    user.value=null;
  }
}

const arr = ref([]);

onMounted(() => {
  //请求所有微博数据
  axios.get('http://localhost:8080/v1/weibos/index').then((response)=>{
    if (response.data.code==1){
      //把请求回来的数据赋值给arr数组
      arr.value=response.data.data;
    }
  })
})


</script>
